<template>
  <!-- 注册 start -->
  <div>
    <div style="background:red;height:400px;width:100%;"></div>
    <div class="registration-process">
      <div class="dv"><span class="sp">1</span> 注册账户</div>
      <div class="dv active"><span class="sp">2</span> 填写注册信息</div>
      <div class="dv"><i class="sp layui-icon layui-icon-ok"></i>注册成功</div>
    </div>
  </div>
  <!-- 注册 end -->
</template>
<script lang="ts" setup></script>
<style lang="scss" scoped>
    /*用户注册和重置密码*/

.user_registered .registration-process {
	display: flex;
	justify-content: center;
	margin: 40px 0px;
}

.user_registered .registration-process .dv {
	margin-right: 105px;
	display: flex;
	align-items: center;
	position: relative;
}

.user_registered .registration-process .dv:nth-child(1):after,
.user_registered .registration-process .dv:nth-child(2):after {
	position: absolute;
	right: -90px;
	content: ' ';
	display: block;
	width: 74px;
	height: 1px;
	background-color: #bfbfbf;
}

.user_registered .dv:last-child {
	margin-right: 0px;
}

.user_registered .registration-process .dv .sp {
	width: 36px;
	height: 36px;
	border-radius: 36px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #bfbfbf;
	color: #ffffff;
	font-weight: bold;
	margin-right: 10px;
}

.user_registered .registration-process .dv.active {
	color: #ffa52a!important;
}

.user_registered .registration-process .dv.active .sp {
	background-color: #ffa52a!important;
}
</style>
